<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="jquery.min (1).js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$(function(){
				$(".sg").hide();
				$("#ul1>ul").hide();	
				
				$("p").click(function(){
					$(".sg").toggle();
					
					if($(".sg").attr("type","hide")){
						$(".ul11").hide();
					}
					
					
					/*if($(".sg").css('display')=='none'){
						$(".sg").next(".ul11").hide();
					}*/
				})
				$(".sg").click(function(){
					$(this).next(".ul11").toggle();
				})
			})
		</script>
	</head>
	<body>
		<div id="">
			<p>水果</p>
			<ul id="ul1">
				<li class="sg">葡萄</li>
				<ul class="ul11">
					<li class="sgz">葡萄</li>
					<li class="sgz">橙子</li>
					<li class="sgz">草莓</li>
				</ul>	
				<li class="sg">橙子</li>
				<ul class="ul11">
					<li class="sgz">葡萄</li>
					<li class="sgz">橙子</li>
					<li class="sgz">草莓</li>
				</ul>
					
				<li class="sg">草莓</li>
				<ul class="ul11">
					<li class="sgz">葡萄</li>
					<li class="sgz">橙子</li>
					<li class="sgz">草莓</li>
				</ul>
					
			</ul>
		</div>
	</body>
</html>
